﻿@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title></title>
</head>
<body>
    <div class="layui-container">
        <table id="mytab" lay-filter="test"></table>
    </div>
    <script type="text/javascript">
        var page = 1;
        var form;
        layui.use(["table", "form", "layer", "laydate"], function () {
            var table = layui.table;
            var form = layui.form;
            var layer = layui.layer;
            var laydate = layui.laydate;
            var load = layer.load(1);

            //数据渲染
            table.render({
                id: "stutb",
                elem: "#mytab",
                url: "/System/User/GetEmployeeList",
                toolbar: "#mytoolbar",
                //totalRow: true,
                cols: [[
                    { checkbox: true, totalRowText: "合计", width: 40 },
                    { field: "emID", title: "编号", width: 60 },
                    { field: "headImg", title: "头像", width: 60, templet: "#headtm" },
                    { field: "emName", title: "姓名", width: 120, templet: "#nametm" },
                    { field: "emSex", title: "性别", sort: true, width: 80 },
                    { field: "phone", title: "手机", width: 120 }, //totalRow: true,
                    { field: "deptName", title: "部门", sort: true, width: 120 },
                    { field: "roleName", title: "角色", width: 120 },
                    { field: "status", title: "状态", width: 70, templet:"#statustm" },
                    { field: "lastTime", title: "时间" },
                    { title: "操作", fixed: "right", width: 160, templet: "#mytm" }
                ]],
                page: {
                    limit: 10,
                    limits: [10, 20, 30, 50, 100],
                    next: "下一页",
                    prev: "上一页",
                    //自定义布局  有什么 顺序
                    layout: ["count", "prev", "page", "next", "skip", "limit"]
                },
                done: function (data, curr, count) {
                    //console.log(data);
                    layer.close(load);
                    page = curr;

                    //处理不能勾选的项
                    let allck = true;
                    $(data.data).each(function (i) {
                        if (this.roleID == 1) { //验证角色为管理员的
                            allck = false;
                            //移除管理员前的复选框
                            $('tr[data-index=' + i + '] td[data-field=0] .layui-table-cell').empty();
                        }
                    });
                    if (allck) {
                        $('th[data-field=0] .layui-table-cell .layui-form-checkbox').show();
                    } else {
                        $('th[data-field=0] .layui-table-cell .layui-form-checkbox').hide();
                    }
                    
                }
            })

            //监视工具栏事件
            table.on("toolbar(test)", function (obj) {
                //console.log(obj);
                switch (obj.event) {
                    case "add":
                        //所有弹层方法 前加上 parent  让弹窗在父窗口
                        var index = parent.layer.open({
                            type: 1,
                            title: false,
                            area: ["440px"],
                            scrollbar: false,
                            content: $("#formadd").html(),
                            success: function (layero, index) {
                                //加载部门角色
                                $.get('/System/Organization/GetOrganization', function (res) {
                                    let d = JSON.parse(res);
                                    //console.log(d);
                                    $(d.data).each(function () {
                                        //排除掉没有角色的部门
                                        if (this.roles.length>0) {
                                            $(layero).find('select[name=deptID]').append('<option value="' + this.deptID + '">' + this.deptName + '</option>');
                                        }
                                    });
                                    $(d.data).each(function () {
                                        //获取当前部门下的角色
                                        if (this.deptID == $(layero).find('select[name=deptID]').val()) {
                                            $(this.roles).each(function () {
                                                $(layero).find('select[name=roleID]').append('<option value="' + this.roleID + '">' + this.roleName + '</option>');
                                            })
                                        }
                                    });
                                    //重新渲染 下拉框
                                    parent.form.render("select");
                                    //部门下拉事件
                                    parent.form.on('select(deptselect)', function (data) {
                                        $(layero).find('select[name=roleID]').empty();
                                        $(d.data).each(function () {
                                            //获取当前部门下的角色
                                            if (this.deptID == data.value) {
                                                $(this.roles).each(function () {
                                                    $(layero).find('select[name=roleID]').append('<option value="' + this.roleID + '">' + this.roleName + '</option>');
                                                })
                                            }
                                        });
                                        parent.form.render("select");
                                    });

                                });
                                parent.form.render();
                                //监控开关的选中
                                parent.form.on('switch(status)', function (data) {
                                    $(data.elem).nextAll("input[type=hidden]").val(data.elem.checked);
                                });
                                //添加保存
                                parent.form.on("submit(myform)", function () {
                                    //获取表单数据 json  filter
                                    var data = parent.form.val("myform");
                                    //console.log(data);
                                    //异步请求添加
                                    $.ajax({
                                        url: "/System/User/AddEmployee",
                                        data: JSON.stringify(data),
                                        type: "post",
                                        dataType: "Json",
                                        contentType: "Application/Json",
                                        success: function (d) {
                                            if (d.code > 0) {
                                                parent.layer.close(index);
                                                parent.layer.msg(d.msg, { icon: 6 });
                                                //重载表格数据
                                                table.reload("stutb", {
                                                    //条件 额外的参数
                                                    where: {
                                                        name: $("#edtSearch").val()
                                                    },
                                                    page: {
                                                        curr: 1 //默认页码
                                                    }
                                                })
                                            } else {
                                                parent.layer.msg(d.msg, { icon: 5 });
                                            }
                                        },
                                        error: function (e) {
                                            console.log(e.responseText);
                                        }
                                    });
                                    return false;
                                })
                            }
                        })
                        break;
                    case "update":
                        //获取选中行信息
                        var checkStatus = table.checkStatus('stutb');
                        if (checkStatus.data.length > 1) {
                            layer.msg("一次只能修改一个", { icon: 0 });
                        } else if (checkStatus.data.length < 1) {
                            layer.msg("请选择要修改的信息", { icon: 0 });
                        } else {
                            var index = parent.layer.open({
                                type: 1,
                                title: false,
                                area: ["440px"],
                                content: $("#formupdate").html(),
                                success: function (layero, index) {
                                    var formdata = checkStatus.data[0];
                                    //加载部门角色
                                    $.get('/System/Organization/GetOrganization', function (res) {
                                        let d = JSON.parse(res);
                                        //console.log(d);
                                        $(d.data).each(function () {
                                            //排除掉没有角色的部门
                                            if (this.roles.length > 0) {
                                                $(layero).find('select[name=deptID]').append('<option value="' + this.deptID + '">' + this.deptName + '</option>');
                                            }
                                        });
                                        //赋值
                                        $(layero).find('select[name=deptID]').val(formdata["deptID"]);
                                        $(d.data).each(function () {
                                            //获取当前部门下的角色
                                            if (this.deptID == formdata["deptID"]) {
                                                $(this.roles).each(function () {
                                                    $(layero).find('select[name=roleID]').append('<option value="' + this.roleID + '">' + this.roleName + '</option>');
                                                })
                                            }
                                        });
                                        //赋值
                                        $(layero).find('select[name=roleID]').val(formdata["roleID"]);
                                        //重新渲染 下拉框
                                        parent.form.render("select");
                                        //部门下拉事件
                                        parent.form.on('select(deptselect)', function (data) {
                                            $(layero).find('select[name=roleID]').empty();
                                            $(d.data).each(function () {
                                                //获取当前部门下的角色
                                                if (this.deptID == data.value) {
                                                    $(this.roles).each(function () {
                                                        $(layero).find('select[name=roleID]').append('<option value="' + this.roleID + '">' + this.roleName + '</option>');
                                                    })
                                                }
                                            });
                                            parent.form.render("select");
                                        });

                                    });

                                    //自己写的表单赋值  layui 的 form 赋值 弹窗父窗口时不行
                                    $(layero).find("form [name]").each(function () {
                                        if ($(this).attr("type") == "radio") {
                                            $(this).prop("checked", $(this).val() == formdata[$(this).attr("name")] ? "checked" : "");
                                        } else if ($(this).attr("lay-skin") == "switch") {
                                            $(this).prop("checked", formdata[$(this).attr("name")]);
                                        }
                                        else {
                                            $(this).val(formdata[$(this).attr("name")]);
                                        }
                                    });

                                    parent.form.render(); //重新渲染表单

                                    //监控开关的选中
                                    parent.form.on('switch(status)', function (data) {
                                        $(data.elem).nextAll("input[type=hidden]").val(data.elem.checked);
                                    });
                                    //修改保存
                                    parent.form.on("submit(myform)", function () {
                                        //获取表单数据 json  filter
                                        var data = parent.form.val("myform");
                                        //console.log(data);
                                        //异步请求修改
                                        $.ajax({
                                            url: "/System/User/UpdateEmployee",
                                            data: JSON.stringify(data),
                                            type: "post",
                                            dataType: "Json",
                                            contentType: "Application/Json",
                                            success: function (d) {
                                                if (d.code > 0) {
                                                    parent.layer.close(index);
                                                    parent.layer.msg(d.msg, { icon: 6 });
                                                    //重载表格数据
                                                    table.reload("stutb", {
                                                        //条件 额外的参数
                                                        where: {
                                                            name: $("#edtSearch").val()
                                                        },
                                                        page: {
                                                            curr: 1 //默认页码
                                                        }
                                                    })
                                                } else {
                                                    parent.layer.msg(d.msg, { icon: 5 });
                                                }
                                            },
                                            error: function (e) {
                                                console.log(e.responseText);
                                            }
                                        });
                                        return false;
                                    });
                                    
                                    
                                }
                            })
                        }
                        break;
                    case "delete":
                        //获取选中行信息
                        var checkStatus = table.checkStatus('stutb');
                        if (checkStatus.data.length < 1) {
                            layer.msg("请选择要删除的信息", { icon: 0 });
                            return;
                        }
                        var name = "";
                        var ids = "";
                        $(checkStatus.data).each(function (i, o) {
                            name += name.length > 0 ? "," + o.emName : o.emName;
                            ids += ids.length > 0 ? "," + o.emID : o.emID;
                        });
                        parent.layer.confirm("确认删除'" + name + "'?", { icon: 3 }, function (index) {
                            $.ajax({
                                url: "/System/User/DeleteAll",
                                type: "post",
                                data: JSON.stringify({ "ids": ids }),
                                dataType: "Json",
                                contentType: "Application/Json",
                                success: function (data) {
                                    //console.log(data);
                                    if (data.code > 0) {
                                        parent.layer.msg(data.msg, { icon: 6 });
                                        table.reload("stutb", {
                                            //条件 额外的参数
                                            where: {
                                                name: $("#edtSearch").val()
                                            },
                                            page: {
                                                curr: page //默认页码
                                            }
                                        })
                                    } else {
                                        parent.layer.msg(data.msg, { icon: 5 });
                                    }
                                }
                                , error: function (e) {
                                    console.log(e);
                                }
                            });
                        });
                        break;
                    case "search":
                        //重载表格数据
                        table.reload("stutb", {
                            //条件 额外的参数
                            where: {
                                name: $("#edtSearch").val()
                            },
                            page: {
                                curr: 1 //默认页码
                            }
                        })
                        break;
                    default:
                }
            })

            //监视列工具条事件
            table.on("tool(test)", function (obj) {
                switch (obj.event) {
                    case "update":
                        var index = parent.layer.open({
                            type: 1,
                            title: false,
                            area: ["440px"],
                            content: $("#formupdate").html(),
                            success: function (layero, index) {
                                //console.log(obj.data);
                                var formdata = obj.data;

                                //加载部门角色
                                $.get('/System/Organization/GetOrganization', function (res) {
                                    let d = JSON.parse(res);
                                    //console.log(d);
                                    $(d.data).each(function () {
                                        //排除掉没有角色的部门
                                        if (this.roles.length > 0) {
                                            $(layero).find('select[name=deptID]').append('<option value="' + this.deptID + '">' + this.deptName + '</option>');
                                        }
                                    });
                                    //赋值
                                    $(layero).find('select[name=deptID]').val(formdata["deptID"]);
                                    $(d.data).each(function () {
                                        //获取当前部门下的角色
                                        if (this.deptID == formdata["deptID"]) {
                                            $(this.roles).each(function () {
                                                $(layero).find('select[name=roleID]').append('<option value="' + this.roleID + '">' + this.roleName + '</option>');
                                            })
                                        }
                                    });
                                    //赋值
                                    $(layero).find('select[name=roleID]').val(formdata["roleID"]);
                                    //重新渲染 下拉框
                                    parent.form.render("select");
                                    //部门下拉事件
                                    parent.form.on('select(deptselect)', function (data) {
                                        $(layero).find('select[name=roleID]').empty();
                                        $(d.data).each(function () {
                                            //获取当前部门下的角色
                                            if (this.deptID == data.value) {
                                                $(this.roles).each(function () {
                                                    $(layero).find('select[name=roleID]').append('<option value="' + this.roleID + '">' + this.roleName + '</option>');
                                                })
                                            }
                                        });
                                        parent.form.render("select");
                                    });

                                });
                                
                                //自己写的表单赋值  layui 的 form 赋值 弹窗父窗口时不行
                                $(layero).find("form [name]").each(function () {
                                    if ($(this).attr("type") == "radio") {
                                        $(this).prop("checked", $(this).val() == formdata[$(this).attr("name")] ? "checked" : "");
                                    } else if ($(this).attr("lay-skin") == "switch") {
                                        $(this).prop("checked", formdata[$(this).attr("name")]);
                                    }
                                    else {
                                        $(this).val(formdata[$(this).attr("name")]);
                                    }
                                });

                                parent.form.render(); //重新渲染表单

                                //监控开关的选中
                                parent.form.on('switch(status)', function (data) {
                                    $(data.elem).nextAll("input[type=hidden]").val(data.elem.checked);
                                });
                                //修改保存
                                parent.form.on("submit(myform)", function () {

                                    //获取表单数据 json  filter
                                    var data = parent.form.val("myform");
                                    //console.log(data);
                                    //异步请求修改
                                    $.ajax({
                                        url: "/System/User/UpdateEmployee",
                                        data: JSON.stringify(data),
                                        type: "post",
                                        dataType: "Json",
                                        contentType: "Application/Json",
                                        success: function (d) {
                                            if (d.code > 0) {
                                                parent.layer.close(index);
                                                parent.layer.msg(d.msg, { icon: 6 });
                                                //重载表格数据
                                                table.reload("stutb", {
                                                    //条件 额外的参数
                                                    where: {
                                                        name: $("#edtSearch").val()
                                                    },
                                                    page: {
                                                        curr: 1 //默认页码
                                                    }
                                                })
                                            } else {
                                                parent.layer.msg(d.msg, { icon: 5 });
                                            }
                                        },
                                        error: function (e) {
                                            console.log(e.responseText);
                                        }
                                    });
                                    return false;
                                });
                            }
                        })
                        break;
                    case "delete":
                        parent.layer.confirm("确认删除'" + obj.data.emName + "'?", { icon: 3 }, function (index) {
                            $.ajax({
                                url: "/System/User/DeleteAll",
                                type: "post",
                                data: JSON.stringify({ "ids": obj.data.emID }),
                                dataType: "Json",
                                contentType: "Application/Json",
                                success: function (data) {
                                    //console.log(data);
                                    if (data.code > 0) {
                                        parent.layer.msg(data.msg, { icon: 6 });
                                        table.reload("stutb", {
                                            //条件 额外的参数
                                            where: {
                                                name: $("#edtSearch").val()
                                            },
                                            page: {
                                                curr: page //默认页码
                                            }
                                        })
                                    } else {
                                        parent.layer.msg(data.msg, { icon: 5 });
                                    }
                                }
                                
                            })
                        });
                        break;
                    case "details":
                        location.href = "/Student/xianqing/" + obj.data.emID;
                        break;
                    default:
                }
            })
        });
    </script>
</body>
</html>

<script type="text/template" id="mytoolbar">
    <div class="layui-table-tool-temp">
        <div class="layui-inline" lay-event="add">
            <i class="layui-icon layui-icon-add-1"></i>
        </div>
        <div class="layui-inline" lay-event="update">
            <i class="layui-icon layui-icon-edit"></i>
        </div>
        <div class="layui-inline" lay-event="delete">
            <i class="layui-icon layui-icon-delete"></i>
        </div>
       

        <div class="layui-inline" style="width:220px;">
            <div class="input-group">
                <input type="text" id="edtSearch" class="layui-input input-sm" placeholder="请输入姓名关键字">
                <div class="input-group-btn" lay-event="search">
                    <button class="layui-btn layui-btn-sm layui-btn-primary icon">
                        <i class="layui-icon layui-icon-search"></i>
                    </button>
                    
                </div>
            </div>
        </div>
    </div>
</script>
<script type="text/template" id="formadd">
    <form class="layui-form layui-form-pane" lay-filter="myform" style="width:400px; margin:20px;">

        <input type="hidden" name="emID" />
        <!--文本框-->
        <div class="layui-form-item">
            <label class="layui-form-label">姓名</label>
            <div class="layui-input-block">
                <input type="text" name="emName" class="layui-input" required lay-verify="required" placeholder="请输入姓名" />
            </div>
        </div>
        <!--单选按钮-->
        <div class="layui-form-item" pane>
            <label class="layui-form-label">性别</label>
            <div class="layui-input-block">
                <input type="radio" name="emSex" value="男" title="男" checked />
                <input type="radio" name="emSex" value="女" title="女" />
            </div>
        </div>
        <!--文本框-->
        <div class="layui-form-item">
            <label class="layui-form-label">手机号码</label>
            <div class="layui-input-block">
                <input type="tel" name="phone" class="layui-input" required lay-verify="required|phone" placeholder="请输入手机号码" />
            </div>
        </div>

        <div class="layui-form-item" >
            <label class="layui-form-label">账户</label>
            <div class="layui-input-block">
                <input type="text" name="loginID" class="layui-input" required lay-verify="required" placeholder="请输入账户" />
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">密码</label>
            <div class="layui-input-block">
                <input type="password" name="pwd" class="layui-input" required lay-verify="required" placeholder="请输入密码" />
            </div>
        </div>

        <!--下拉列表-->
        <div class="layui-form-item" >
            <label class="layui-form-label">部门</label>
            <div class="layui-input-block selectUp" >
                <select name="deptID" required lay-verify="required" lay-filter="deptselect" lay-search>
                </select>
            </div>
        </div>

        <!--下拉列表-->
        <div class="layui-form-item" >
            <label class="layui-form-label">角色</label>
            <div class="layui-input-block selectUp" >
                <select name="roleID" required lay-verify="required" lay-filter="roleselect" lay-filit lay-search>
                </select>
            </div>
        </div>

        <!--开关-->
        <div class="layui-form-item" pane>
            <label class="layui-form-label">状态</label>
            <div class="layui-input-block">
                <input type="checkbox" lay-filter="status" lay-skin="switch" lay-text="激活|冻结" checked>
                <input type="hidden" name="status" value="true" />
            </div>
        </div>

        <!--时间框-->
        @*<div class="layui-form-item">
            <label class="layui-form-label">时间</label>
            <div class="layui-input-block">
                <input id="date" type="text" name="date" autocomplete="off" class="layui-input" placeholder="请选择出生日期" />
            </div>
        </div>*@

        <!--按钮-->
        <div class="layui-btn-container">
            <input type="submit" class="layui-btn layui-btn-fluid" lay-submit value="立即提交" />
        </div>
    </form>
</script>
<script type="text/template" id="formupdate">
    <form class="layui-form layui-form-pane" lay-filter="myform" style="width:400px; margin:20px;">

        <input type="hidden" name="emID" />
        <!--文本框-->
        <div class="layui-form-item">
            <label class="layui-form-label">姓名</label>
            <div class="layui-input-block">
                <input type="text" name="emName" class="layui-input" required lay-verify="required" placeholder="请输入姓名" />
            </div>
        </div>
        <!--单选按钮-->
        <div class="layui-form-item" pane>
            <label class="layui-form-label">性别</label>
            <div class="layui-input-block">
                <input type="radio" name="emSex" value="男" title="男" checked />
                <input type="radio" name="emSex" value="女" title="女" />
            </div>
        </div>
        <!--文本框-->
        <div class="layui-form-item">
            <label class="layui-form-label">手机号码</label>
            <div class="layui-input-block">
                <input type="tel" name="phone" class="layui-input" required lay-verify="required|phone" placeholder="请输入手机号码" />
            </div>
        </div>

        <!--下拉列表-->
        <div class="layui-form-item" >
            <label class="layui-form-label">部门</label>
            <div class="layui-input-block selectUp">
                <select name="deptID" required lay-verify="required" lay-filter="deptselect" lay-search>
                </select>
            </div>
        </div>

        <!--下拉列表-->
        <div class="layui-form-item">
            <label class="layui-form-label">角色</label>
            <div class="layui-input-block selectUp">
                <select name="roleID" required lay-verify="required"  lay-filter="roleselect" lay-filit lay-search>
                </select>
            </div>
        </div>

        <!--开关-->
        <div class="layui-form-item" pane>
            <label class="layui-form-label">状态</label>
            <div class="layui-input-block">
                <input type="checkbox" name="status" lay-filter="status" lay-skin="switch" lay-text="激活|冻结" checked>
                <input type="hidden" name="status" value="true" />
            </div>
        </div>
        <!--按钮-->
        <div class="layui-btn-container">
            <input type="submit" class="layui-btn layui-btn-fluid" lay-submit value="立即提交" />
        </div>
    </form>
</script>
<script type="text/html" id="nametm">
    <a href="/Student/xianqing/{{d.emID}}">{{d.emName}}</a>
</script>
<script type="text/html" id="headtm">
    <img style="margin-right:0px;" class="layui-nav-img" src="{{d.headImg}}" />
</script>
<script type="text/html" id="statustm">
    {{# if(d.status==0){}}
    <span class="layui-badge layui-bg-orange">冻结</span>
    {{# } }}
    {{# if(d.status==1){ }}
    <span class="layui-badge layui-bg-green">正常</span>
    {{# } }}
</script>
<script type="text/html" id="mytm">
    {{# if(d.roleID>1){}}
    <input type="button" lay-event="update" class="layui-btn layui-btn-xs layui-btn-warm" value="修改" />
    <input type="button" lay-event="delete" class="layui-btn  layui-btn-xs layui-btn-danger" value="删除" />
    {{# }}}
    <input type="button" lay-event="details" class="layui-btn layui-btn-xs" value="查看" />
</script>
